<template>
  <div class="Zhi">
    <div class="banner">
      <Banners :banners="banners"></Banners>
    </div>
    <Cells :cells="cells"></Cells>
    <div class="exposure">
      <img src="https://i8.mifile.cn/v1/a1/72411ddf-3df9-8d3a-7e5d-9429991710dc.webp" alt="">
    </div>
    <div class="exposure">
      <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/c25c68694e064f1eda1c207ad481f767.jpg" alt="">
    </div>
    <Cells3 :cells3="cells3"></Cells3>
  </div>
</template>

<script>
import instance from "../../../api/request";
import Banners from "../Banners";
import Cells from "./public-coms/Cells";
import Cells3 from "./public-coms/Cells3";
export default {
  name: "Zhi",
  data() {
    return {
      banners: [],
      cells: [],
      cells3:[]
    };
  },
  methods: {
    async fn_api() {
      let { data } = await instance.get("/index.json");
      let zhi = data.home.zhi;
      this.banners = zhi.banners;
      this.cells = zhi.cells;
      this.cells3 = zhi.cells3;
    },
  },
  created() {
    this.fn_api();
  },
  components: {
    Banners,
    Cells,
    Cells3,
  },
};
</script>

<style lang="less" scoped>
.exposure{
  width: 7.2rem;
  margin-top:0.16rem;
  img{
    width: 100%;
  }
}
</style>